import React,{Component} from "react";

import axios from 'axios'

//评论显示页面
class Remark extends React.Component{
    constructor(props) {
        super(props);
        this.state={
            comment_list:[]
        }
    }

    getBlog(){
        axios.get("",{
            blogID:this.props.blogID
        }).then(res=>{
            console.log(res)
        })
    }


    render() {
        return (
            <div>
                {/*blog内容*/}
                <div>
                    <div className="blog container">
                        <div className="blog_body">
                            <div className="d-flex justify-content-start">
                                <img className="pic_r" src={process.env.PUBLIC_URL + '/imgs/1.jpg'} alt="头像"/>
                                <div className="d-flex flex-column bd-highlight mb-3">
                                    <label className="nickname">{this.state.blog.nickname}</label>
                                    <label className="pub_time">{this.state.blog.pubTime}</label>
                                </div>
                            </div>
                            <div className="blog_content d-flex justify-content-around">
                                {
                                    this.state.blog.img_list.map((item,index)=>{
                                        return (<img className="blog_img" src={process.env.PUBLIC_URL + item}/>)
                                    })
                                }

                            </div>
                            <p className="card-text">{this.state.blog.words}</p>
                        </div>
                    </div>
                </div>

                {/*评论区*/}
                <div>
                    <label>评论</label>
                    {
                        this.state.comment_list.map((item,index)=>{
                            return(
                                <div key={index}>
                                    <div className="nickname">{item.nickname}</div>
                                    <div className="comment">{item.comment}</div>
                                    <div className="answer">
                                        {
                                            item.answers.map((it,ind)=>{
                                                return (
                                                    <div>
                                                        <div className="nickname">
                                                            {it.nickname}
                                                        </div>
                                                        <div className="comment">
                                                            {it.comment}
                                                        </div>
                                                    </div>
                                                )
                                            })
                                        }
                                    </div>
                                </div>
                            )
                        })
                    }
                    <div>
                        评论内容
                        回复内容
                        <div>

                        </div>
                    </div>
                </div>
            </div>
        );
    }

}